<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <head th:include="common/common_head :: commonHead('系统日志管理')"></head>
    <link rel="stylesheet" th:href="@{/static/plugin/beone/main.css}"/>
</head>
<body>
<div class="lenos-search">
    <div class="select">
        开始时间：
        <div class="layui-inline">
            <input class="layui-input layui-time" height="20px" id="startTime" autocomplete="off"/>
        </div>
        结束时间：
        <div class="layui-inline">
            <input class="layui-input layui-time" height="20px" id="endTime" autocomplete="off"/>
        </div>

        <button class="select-on layui-btn layui-btn-sm" data-type="select"><i class="layui-icon"></i>
        </button>
        <button class="layui-btn layui-btn-sm icon-position-button" id="refresh" data-type="reload" style="float: right">
            <i class="layui-icon">&#xe669;</i>
        </button>
    </div>
</div>
<table id="logList" class="layui-hide" lay-filter="user"></table>

<script th:inline="javascript">/*<![CDATA[*/
layuiUtils.onEnter(function () {
    $(".select .select-on").click();
});
layui.use(['table','laydate'], function () {
    var table = layui.table, laydate = layui.laydate;

    laydate.render({  id:"startTime", elem:"#startTime" });
    laydate.render({  id:"endTime", elem:"#endTime" });
    var listUrl =  /*[[@{/system/log/list}]]*/ "/system/log/list";
    //方法级渲染
    table.render({
        id: 'logList',  elem: '#logList',method:'POST' , url: listUrl
        , cols: [[
              {field: 'username', title: '操作用户', width: '10%'}
            , {field: 'ip', title: 'IP', width: '10%'}
            , {field: 'type', title: '类型', width: '8%'}
            , {field: 'content', title: '日志内容', width: '25%'}
            , {field: 'param', title: '操作相关参数', width: '32%'}
            , {field: 'createTime', title: '操作时间', width: '12%'}
        ]]
        , page: true, request:{pageName:'page',limitName:'rows'}, height: 'full-83'
    });

    var $ = layui.$, active = {
        select: function () {
            var startTime = $('#startTime').val();
            var endTime = $('#endTime').val();
            table.reload("logList", {
                where: {startTime: startTime,endTime:endTime}
            });
        },
        reload:function(){
            $('#startTime').val('');
            $('#endTime').val('');
            table.reload("logList", {
                where: {startTime: null,endTime:null}
            });
        }
    };

    /*按钮事件绑定*/
    $('.select .layui-btn').on('click', function () {
        var type = $(this).data('type');
        active[type] ? active[type].call(this) : '';
    });
});
/*]]>*/</script>
</body>
</html>